<template>
  <div class="app-container">
    <el-form
      :model="order"
      :rules="rules"
      ref="ruleForm"
      label-width="200px"
      class="demo-ruleForm"
    >
      <el-form-item label="商品" prop="goodsId">
        <el-input :value="goodsName" disabled></el-input>
      </el-form-item>
      <el-form-item label="价格" prop="price">
        <el-input :value="order.price" disabled></el-input>
      </el-form-item>
      <el-form-item label="订单类型" prop="orderType">
        <el-select v-model="order.orderType" placeholder="" disabled>
          <el-option
            v-for="item in this.$store.state.dict.orderType"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="订单状态" prop="orderStatus">
        <el-select v-model="order.orderStatus" placeholder="" >
          <el-option
            v-for="item in this.$store.state.dict.orderStatus"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="是否积分抵扣" prop="useIntegral">
        <el-select v-model="order.useIntegral" placeholder="" disabled>
          <el-option
            v-for="item in this.$store.state.dict.useIntegral"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="订单创建人" prop="userId">
        <el-input :value="order.user.realName" disabled></el-input>
      </el-form-item>
      <el-form-item label="积分抵扣数量" prop="integralNum">
        <el-input :value="order.integralNum" disabled></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="submitForm('ruleForm')"
          >提交</el-button
        >
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { updateOrderApi, getOrderApi } from "@/api/order";
export default {
  data() {
    return {
      goodsName: "",
      order: {
        user: {},
        video: {},
        eBook: {}
      },
      rules: {
        
      },
    };
  },
  created() {
    this.order.id = this.$route.params.id;
    this.getOrder(this.order.id);
  },
  methods: {
    getOrder(id) {
      getOrderApi(id).then((response) => {
        this.order = response.data;
        if (this.order.orderType == 1) {
          this.goodsName = this.order.video.videoName;
        } else {
          this.goodsName = this.order.eBook.bookName;
        }
        delete this.order.createTime;
      });
    },
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          updateOrderApi(this.order).then((response) => {
            if (response.status == 0) {
              this.$message("提交成功");
            }
            this.$router.push("/content/order");
          });
        }
      });
    },
  },
};
</script>